<div id="addKeyModal" class="modal hide fade">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal">×</button>
    <h3>Add Key</h3>
  </div>
  <div class="modal-body">
    <form id="addKeyForm" action="apiv2/key/" method="POST" class="form-vertical">
      <div class="control-group">
        <label class="control-label" for="keyValue">Key</label>
        <div class="controls">
          <input id="keyValue" type="text" value="" class="modal-content-width"/>
        </div>
      </div>
      <div class="control-group">
        <label class="control-label" for="keyType">Type</label>
        <div class="controls">
          <select id="keyType" name="keyType">
            <option value="string">String</option>
            <option value="list">List</option>
            <option value="set">Set</option>
            <option value="zset">Sorted Set</option>
            <option value="hash">Hash</option>
            <option value="stream">Stream</option>
          </select>
        </div>
      </div>
      <span id="timestampWrap" class="control-group">
        <label class="control-label" for="keyTimestamp">Timestamp</label>
        <input id="keyTimestamp" name="keyTimestamp" class="input-mini span2" type="text" value="*"/>
      </span>
      <span id="scoreWrap" class="control-group">
        <label class="control-label" for="keyScore">Score</label>
        <input id="keyScore" name="keyScore" class="input-mini" type="text"/>
      </span>
      <span id="fieldWrap" class="control-group">
        <label class="control-label" for="newFieldName">Field</label>
        <input id="newFieldName" name="fieldName" class="modal-content-width" type="text"/>
      </span>
      <div class="control-group" style="display:inline;">
        <div class="controls">
        </div>
      </div>
      <span id="fieldValueWrap" class="control-group">
        <label class="control-label" for="newFieldValue">Field</label>
        <textarea id="newFieldValue" name="fieldValue" class="modal-content-width" style="height: 200px;"></textarea>
        <label class="checkbox"><input type="checkbox" id="addKeyFieldIsJson" name="isJson">Validate as JSON</label>
      </span>
      <label class="control-label" for="newStringValue">Value</label>
      <textarea id="newStringValue" name="stringValue" class="modal-content-width" style="height: 200px;"></textarea>
      <label class="checkbox"><input type="checkbox" id="addKeyValueIsJson" name="isJson">Validate as JSON</label>

      <input id="addKeyConnectionId" type="hidden" value=""/>
    </form>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal">Close</button>
    <button id="saveKeyButton" type="button" class="btn btn-primary" onclick="addNewKey()">Save</button>
  </div>
</div>
<script>
  setupJsonInputValidator('addKeyValueIsJson', 'newStringValue');
  setupJsonInputValidator('addKeyFieldIsJson', 'newFieldValue');
  registerModalFocus('addKeyModal', 'keyValue');
</script>
